<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>交易记录</title>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">

    <link rel="stylesheet" href="/gupiao/css/weui.css">
    <link rel="stylesheet" href="/gupiao/css/jquery-weui.css">
    <link rel="stylesheet" href="/gupiao/css/style.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_689900_tgundrn0e1a46lxr.css">

    <style>
        .weui-cell{padding: 0px 0px;}
        .weui-cells{padding-top:18px;}
        .index-xingchengz .weui-cells{font-size: 15px;margin-top:0;}
        .xingchengz .weui-cells .weui-cell{padding-top:0px;padding-bottom:2px;}
        .xingchengz .weui-cells .weui-cell:before{border:0;}
        .xingchengz .weui-cells:after{border:0;}
        .xingchengz .weui-cells{margin-top:0;}
        .xingchengz .weui-cells:before{ border-top:0;}
        .xingchengz .weui-cells .weui-cell__hd span.dianf{background-color:#fff;display: block; width: 5px;height: 5px;border-radius: 50%;margin-right: 3vw}
        .xingchengz .weui-cells .weui-cell__hd span.dian{background-color:#33c2a4;display: block; width: 5px;height: 5px;border-radius: 50%;margin-right: 3vw}
        .xingchengz .weui-cells .weui-cell__hd span.dian2{background-color:#ff8a5a;display: block; width: 5px;height: 5px;border-radius: 50%;margin-right: 3vw}
    </style>
</head>
<body class="back1">


<div class="index-top-fix">
    <a href="myCenter.html" class="iconfont icon-left- left"></a>
    <p class="title">交易记录</p>
</div>

<div class="mt50"></div>

<div id="list">



</div>



<div class="weui-loadmore" id="loadmore">
    <i class="weui-loading"></i>
    <span class="weui-loadmore__tips">正在加载</span>
</div>


</body>
</html>

<script src="/gupiao/js/jquery.min.js"></script>
<script src="/gupiao/js/jquery-weui.min.js"></script>

<script>
    $(function(){
        $.ajax({
            type : "GET",
            url : "{:url('gupiao.users/record')}",
            dataType:'json',
            success : function (res) {
                if(res.code == 200){
                    var   banner  = res.data;
                    var  html    = '';
                    if(banner.length != 0){
                        for(var i=0;i<banner.length;i++){
                            var data = res.data[i];
                            html +="<div class=\"index-box index-xingchengz\">\n" +
                                "        <div class=\"weui-cell left0\">\n" +
                                "            <div class=\"weui-cell__bd xingchengz\">\n" +
                                "                <div style=\"float: left;height: 110px;text-align: center;line-height: 110px;width: 35%\">\n" +
                                "                    <img src=\""+data.photo+"\" style=\"width: 70%;height: 70%;\">\n" +
                                "                </div>\n" +
                                "                <div class=\"weui-cells\" style=\"float: right;width: 64%\">\n" +
                                "                    <div class=\"weui-cell\" style=\"font-size: 13px;color: black\">\n" +
                                "                        <div class=\"weui-cell__hd\">\n" +
                                "                           订单号:\n" +
                                "                            </div>\n" +
                                "                        <div class=\"weui-cell__bd\">\n" +
                                "                            <p>"+data.order_id+"</p>\n" +
                                "                            </div>\n" +
                                "                        </div>\n" +
                                "                    <div class=\"weui-cell\" style=\"font-size: 12px;color: grey\">\n" +
                                "                            <div class=\"weui-cell__hd\">\n" +
                                "                            "+data.username+"\n" +
                                "                            </div>\n" +
                                "                            <div class=\"weui-cell__bd\">\n" +
                                "\n" +
                                "                            </div>\n" +
                                "                    </div>\n" +
                                "                    <div class=\"weui-cell\" style=\"font-size: 12px;color: grey\">\n" +
                                "                        <div class=\"weui-cell__hd\">\n" +
                                "                            交易金额：\n" +
                                "                            </div>\n" +
                                "                        <div class=\"weui-cell__bd\">\n" +
                                "                            <p>"+data.amount+"元</p>\n" +
                                "                            </div>\n" +
                                "                        </div>\n" +
                                "                    <div class=\"weui-cell\" style=\"font-size: 12px;color: grey\">\n" +
                                "                        <div class=\"weui-cell__hd\">\n" +
                                "                           时间：\n" +
                                "                            </div>\n" +
                                "                        <div class=\"weui-cell__bd\">\n" +
                                "                            <p>"+data.create_time+"</p>\n" +
                                "                            </div>\n" +
                                "                        </div>\n" +
                                "                    </div>\n" +
                                "                </div>\n" +
                                "            </div>\n" +
                                "        </div>"
                        }

                    }
                    if(banner.length == 0){

                        html += "<div style='text-align: center;padding:20px 0;color:#ccc;'>暂时没有数据</div>";

                    }

                    if(res.count < 15 ){
                        $("#loadmore").hide();
                    }

                    $("#list").html(html);
                }
            }
        })
    })
</script>



<script>
    // 进行下拉刷新的时候进行加载
    var _page = 1;
    var loading = false;  //状态标记
    $(document.body).infinite().on("infinite", function() {
        if(loading) return;
        loading = true;
        setTimeout(function() {
            _page++;
            $.ajax({
                type : "POST",
                url : "{:url('gupiao.users/record')}",
                data:{page:_page},
                dataType:'json',
                success : function (res) {
                    if(res.code == 200){
                        var   banner  = res.data;
                        var   html    = '';
                        if(banner.length > 0){
                            for(var i=0;i<banner.length;i++){
                                var data = res.data[i];
                                html += "<div class=\"index-box index-xingchengz\">\n" +
                                    "        <div class=\"weui-cell left0\">\n" +
                                    "            <div class=\"weui-cell__bd xingchengz\">\n" +
                                    "                <div style=\"float: left;height: 110px;text-align: center;line-height: 110px;width: 35%\">\n" +
                                    "                    <img src=\""+data.photo+"\" style=\"width: 70%;height: 70%\">\n" +
                                    "                </div>\n" +
                                    "                <div class=\"weui-cells\" style=\"float: right;width: 64%\">\n" +
                                    "                    <div class=\"weui-cell\" style=\"font-size: 13px;color: black\">\n" +
                                    "                        <div class=\"weui-cell__hd\">\n" +
                                    "                           订单号:\n" +
                                    "                            </div>\n" +
                                    "                        <div class=\"weui-cell__bd\">\n" +
                                    "                            <p>"+data.order_id+"</p>\n" +
                                    "                            </div>\n" +
                                    "                        </div>\n" +
                                    "                    <div class=\"weui-cell\" style=\"font-size: 12px;color: grey\">\n" +
                                    "                            <div class=\"weui-cell__hd\">\n" +
                                    "                            "+data.username+"\n" +
                                    "                            </div>\n" +
                                    "                            <div class=\"weui-cell__bd\">\n" +
                                    "\n" +
                                    "                            </div>\n" +
                                    "                    </div>\n" +
                                    "                    <div class=\"weui-cell\" style=\"font-size: 12px;color: grey\">\n" +
                                    "                        <div class=\"weui-cell__hd\">\n" +
                                    "                            交易金额：\n" +
                                    "                            </div>\n" +
                                    "                        <div class=\"weui-cell__bd\">\n" +
                                    "                            <p>"+data.amount+"元</p>\n" +
                                    "                            </div>\n" +
                                    "                        </div>\n" +
                                    "                    <div class=\"weui-cell\" style=\"font-size: 12px;color: grey\">\n" +
                                    "                        <div class=\"weui-cell__hd\">\n" +
                                    "                           时间：\n" +
                                    "                            </div>\n" +
                                    "                        <div class=\"weui-cell__bd\">\n" +
                                    "                            <p>"+data.create_time+"</p>\n" +
                                    "                            </div>\n" +
                                    "                        </div>\n" +
                                    "                    </div>\n" +
                                    "                </div>\n" +
                                    "            </div>\n" +
                                    "        </div>"
                            }

                        }
                        if(banner.length == 0){

                            html += "<div style='text-align: center;padding:20px 0;color:#ccc;'>最新数据</div>";

                        }

                        if(res.count < 15){
                            $("#loadmore").hide();
                        }
                        $("#list").append(html);
                    }
                }
            });
            // loading = false;
        }, 1500);   //模拟延迟
    });

</script>
